<template>
	<OrderSeePage :backname="backname" :orderTitle="orderTitle">
		<template v-slot:OrderDetail>
			<li>
				单号：<span>{{ info.order_sn }}</span>
			</li>
			<li>
				类型：<span>{{ type_list[info.type] }}</span>
			</li>
			<li>
				用户名称：<span>{{ info.member ? info.member.nickname : "" }}</span>
			</li>
			<li>
				状态：<span> {{ status_list[info.status] }}</span>
			</li>
			<template v-if="type == 2">
				<li>
					预归还金额：<span>{{ info.advance_money }}</span>
				</li>
				<li>
					实归还金额：<span>{{ info.money }}</span>
				</li>
				<li>
					司机：<span>{{ info.driver ? info.driver.name : "" }}</span>
				</li>
				<li>
					提交时间：<span>{{ info.submit_time | dateFormat }}</span>
				</li>
			</template>
			<template v-if="type == 1">
				<li>
					预借出金额：<span>{{ info.advance_money }}</span>
				</li>
				<li>
					实借出金额：<span>{{ info.money }}</span>
				</li>
				<li>
					司机：<span>{{ info.driver ? info.driver.name : "" }}</span>
				</li>
				<li>
					提交时间：<span>{{ info.submit_time | dateFormat }}</span>
				</li>
			</template>

			<li class="main_w100">
				备注：<span>{{ info.remark }}</span>
			</li>
		</template>

		<template v-slot:default>
			<div v-loading="listLoading">
				<Table>
					<template v-slot:Title> 物品列表 </template>
					<template v-slot:Table>
						<el-table
							ref="multipleTable"
							:data="list"
							v-loading="loading"
							element-loading-text="加载中"
							fit
							highlight-current-row
						>
							<!-- show-summary -->
							<el-table-column label="序号" prop="userId" width="80">
								<template slot-scope="scope">{{ scope.$index + 1 }}</template>
							</el-table-column>
							<el-table-column
								label="物品名称"
								prop="goods_name"
								show-overflow-tooltip
							/>
							<el-table-column
								label="单位"
								prop="unit_title"
								show-overflow-tooltip
							/>
							<el-table-column
								:label="type == 1 ? '预借出数量' : '预归还数量'"
								prop="advance_num"
								show-overflow-tooltip
							/>
							<el-table-column
								:label="type == 1 ? '实借出数量' : '实归还数量'"
								prop="num"
								show-overflow-tooltip
							/>
							<el-table-column label="单价" prop="price" show-overflow-tooltip>
							</el-table-column>
							<el-table-column
								:label="type == 1 ? '预借出金额' : '预归还金额'"
								prop="sort_num"
								show-overflow-tooltip
							>
								<template slot-scope="scope">
									{{
										roundFloat(
											multiplyFloat(scope.row.price, scope.row.advance_num),
											2
										)
									}}
								</template>
							</el-table-column>
							<el-table-column
								:label="type == 1 ? '实借出金额' : '实归还金额'"
								prop="money"
								show-overflow-tooltip
							/>
						</el-table>
					</template>
				</Table>
				<Table>
					<template v-slot:Title> 生命周期 </template>
					<template v-slot:Table>
						<el-table
							ref="multipleTable"
							:data="logs"
							element-loading-text="加载中"
							fit
							highlight-current-row
						>
							<el-table-column
								label="管理员"
								prop="admin.name"
								class-name="main_hei"
							/>
							<el-table-column
								label="操作"
								prop="operate.name"
								class-name="main_hei"
							/>
							<el-table-column
								label="内容"
								prop="content"
								class-name="main_hei"
							>
								<template slot-scope="scope">
									<div
										v-for="(content, index) in scope.row.content"
										:key="index"
										class="marginTop5 marginBottom5"
									>
										{{ content }}
									</div>
								</template>
							</el-table-column>
							<el-table-column label="IP" prop="ip" class-name="main_hei" />
							<el-table-column
								label="时间"
								prop="created_at"
								class-name="main_hei"
							>
								<template slot-scope="scope">{{
									parseTime(scope.row.created_at)
								}}</template>
							</el-table-column>
						</el-table>
					</template>
				</Table>
			</div>
		</template>
	</OrderSeePage>
</template>
<script>
	import OrderSeePage from "@/components/OrderSeePage";
	import Table from "@/components/OrderSeePage/table.vue";
	import { parseTime, exportMethod, getNowMonth } from "@/utils/index";
	import { multiplyFloat, roundFloat } from "@/utils/math.js";
	import { turnoverOrder_info } from "@/api/warehouse/warehouseTurnOrder";
	export default {
		components: {
			OrderSeePage,
			Table,
		},
		data() {
			return {
				parseTime,
				multiplyFloat,
				roundFloat,
				backname: "周转记录",
				orderTitle: "基础信息",
				type: "1",
				info: {
					driver: {},
				},
				loading: true,
				listLoading: false,
				list: [],
				send_time: [],
				status_list: [],
				type_list: [],
				logs: [],
				id: "",
			};
		},
		filters: {
			dateFormat(val) {
				return val ? parseTime(val, "{y}-{m}-{d}") : "";
			},
		},
		methods: {
			turnoverOrder_info() {
				let data = {
					id: this.id,
				};
				this.loading = true;
				turnoverOrder_info(data).then((res) => {
					if (res.errcode == 0) {
						this.info = res.data.info;
						this.type = res.data.info.type;
						res.data.info.order_list.map((e) => {
							e.goods_name = `${e.goods.name}【${e.goods_spu.spu_name.title}】`;
							e.unit_title = e.goods_spu.spu_unit.title;
						});
						this.list = res.data.info.order_list;
						this.status_list = res.data.status_list;
						this.type_list = res.data.type_list;
					}
					this.loading = false;
				});
			},
		},
		created() {
			this.id = this.$route.params.id;
			this.turnoverOrder_info();
		},
	};
</script>
<style lang='scss' scoped>
</style>
